<%@ taglib prefix="t" uri="/easyui-tags" %>
<%@ page import="org.jeecgframework.web.util.StaticValue" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@include file="/context/mytags.jsp" %>
<html>
<head>
    <title>自定义报表</title>
    <t:base type="jquery,easyui,tools,DatePicker"></t:base>
    <link rel="stylesheet" href="plug-in/jquery/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <script type="text/javascript" src="plug-in/jquery/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="plug-in/jquery/jquery.ztree.excheck.js"></script>
    <script type="text/javascript" src="plug-in/tools/Transfer.js"></script>
    <style type="text/css">
        thead th {
            border-top: 1px solid #000000;
            border-left: 1px solid #000000;
            border-bottom: 1px solid #000000;
            border-collapse: collapse;
            padding: 5px;
        }

        td {
            white-space: nowrap;
        }

        select {
            width: 146px;
        }

        /*.ztree li ul.line {*/
        /*height: 100%;*/
        /*}*/
    </style>
</head>
<script type="text/javascript">
    var setting = {
        check: {
            enable: true
        }

    };
    /**
     * 判断表名，业务等符合条件后 点击 生成待选 在待选项目中根据主业务和关联业务 生成 待选项目
     * @params type 判断当前页为 编辑/新建 状态
     */
    function getTableNames(type) {
        var flag = true;
        var zNodes;
        var nameArry = [];  //主业务+关联业务（即待选项目中所有要展示的业务）
        var reportName = $("#reportName").val();
        if (reportName == '' || reportName == null) {
            tip("报表名称不能为空！");
            flag = false;
            return false;
        }

        var rotaListIdName = $("#rotaListId").val();    //主业务
        if (rotaListIdName == '' && rotaListIdName.length == 0) {
            tip("请选择表");
            flag = false;
            return false;
        }
        nameArry.push(rotaListIdName);
        var rotaName = $("select[name = 'rotaListName1']").attr('selected', 'selected').val();
        $("select[name = 'rotaListName1']").each(function () {
            if (nameArry.indexOf($(this).attr('selected', 'selected').val()) == -1) {
                nameArry.push($(this).attr('selected', 'selected').val());
            } else {
                tip("关联表业务不能相同！");
                flag = false;
                return false;
            }
        });
        $("#select_right").empty(); //清空已经选中的内容

        var t = true;
        if (type == 'save') {
            //检查报表名称是否有重复
            t = checkName();
        }

        if (flag && t) {
            //根据主业务和关联业务获取待选项目中可以生成的树
            $.ajax({
                url: "cbsCgreportHeadController.do?getzdNameForTableName",
                data: {"nameArray": nameArry},
                cache: false,
                traditional: true,
                dataType: 'json',
                type: 'POST',
                success: function (data) {
                    $("#select_left").hide();
                    var raMap = data.obj;
                    zNodes = raMap;
                    zNodes = eval(zNodes);//序列化json数据
                    $.fn.zTree.init($("#treeDemo"), setting, zNodes);//初始化树
                }
            });
        }
    }

    /**
     * 添加 已选中的 待选项目 至 已选项目
     */
    function addTables() {
        var html = "";
        var nodes = new Array();
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");   //获取树“treeDemo”所有数据
        var childNodes = treeObj.getCheckedNodes(true);     //获取树中被勾选的数据

        for (var i = 0; i < childNodes.length; i++) {
            var flag = childNodes[i].isParent;
            if (flag == true) {
                continue;
            } else {
                nodes[i] = childNodes[i].id;
                // nodes[i] = childNodes[i].name;
                html += "<option value=" + childNodes[i].id + ">" + childNodes[i].name + "</option>";
            }

        }
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        treeObj.checkAllNodes(false);
        $("#select_right").append(html);
    }

    /**
     *
     */
    function moveTables() {
        $("#select_right").find("option:selected").remove()
    }
</script>
<body>
<table class="nobordertable noborder" style="border: none;">
    <tbody id="mtbody">
    <tr>
        <td width="5%"></td>
        <td class="al_r" width="15%">
            <label>报表名称<label style="color: red;">*</label>:</label>
        </td>
        <td width="25%">
            <input id="reportName" name="name"/>&nbsp&nbsp&nbsp<span id="isOrNotUse"></span>
        </td>
        <td class="al_r" width="10%">
            <label>报表说明:</label>
        </td>
        <td width="30%" rowspan="2">
            <textarea style="width: 100%;height: 60px;" id="content"></textarea>
        </td>
        <td width="15%"></td>
    </tr>
    <tr>
        <td width="10%"></td>
        <td class="al_r" width="10%">
        </td>
        <td colspan="3" width="80%"><span style="font-size:3px;">不能含有以下特殊字符：@/'"#$%&^*!￥:;.+=()<>、</span></td>
        <td width="10%"></td>
    </tr>
    <tr>
        <td width="5%"></td>
        <td class="al_r" width="15%">
            <label>选择主业务<label style="color: red;">*</label>:</label>
        </td>
        <td width="25%">
            <select name="rotaListName" id="rotaListId"
                    onchange="changeRotaLevel(this.options[this.options.selectedIndex].value)">
                <option value="">-- 请选择 --</option>
                <c:forEach items="${cbsRotaLevelList}" var="rota" varStatus="v">
                    <option value="${rota.id}">${rota.rotaNameChinese}</option>
                </c:forEach>
            </select>
        </td>
        <td class="al_r" width="10%">
        </td>
        <td width="30%">
        </td>
        <td width="15%"></td>
    </tr>
    <tr>
        <td width="5%"></td>
        <td class="al_r" width="15%">
            <label>选择关联业务:</label>
        </td>
        <td width="25%">
            <div id="rotaSelect">
                <select name="rotaListName1" id="rotaListId1">
                    <option value="">-- 请选择 --</option>
                </select>
                <input type="button" value="添加" onclick="addTable()">
            </div>
        </td>
        <td class="al_r" width="10%">
            <label>是否共享:</label>
        </td>
        <td width="30%">
            <input type="checkbox" name="gx"/>
        </td>
        <td width="15%"></td>
    </tr>
    </tbody>
</table>
<div style="margin: 10px auto; text-align: center;">
    <a href="#" class="easyui-linkbutton l-btn" onclick="getTableNames('save')">生成待选</a>
    <a href="#" class="easyui-linkbutton l-btn" onclick="saveRoteLevel('save')">保存</a>
    <a href="#" class="easyui-linkbutton l-btn" onclick="seeResult('save')">预览结果</a>
</div>
<div class="line"></div>
<form id="myform" name="myform" method="post">
    <table style="width: 100%;">
        <tbody>
        <tr>
            <td width="40%" style="vertical-align:top;">
                <table align="top" width="100%" border="0">
                    <tr>
                        <td width="80" align="center">
                            <div class="subtitle" style="border: 0px;">
                                <p>待选项目</p>
                            </div>
                            <div class="ty-transfer-list-body"
                                 style="border: 1px solid #DCDCDC;overflow:scroll;height: 390px">
                                <ul id="treeDemo" class="ztree">
                                </ul>
                            </div>

                        </td>
                        <td width="10" align="center">
                            <input type="button" value="添加"
                                   onclick="addTables()"><br><br>
                            <input type="button" value="删除"
                                   onclick="moveTables()">
                        </td>
                        <td width="80" align="center">
                            <div class="subtitle" style="border: 0px;">
                                <p>已选项目</p>
                            </div>
                            <div style="height: 390px;">
                                <select style="width:100%;height: 390px;overflow:auto;" multiple id="select_right"
                                        name="select_right"
                                        ondblclick="moveOption(this, document.getElementById('select_right'))">
                                </select>
                            </div>

                        </td>
                        <td width="10" align="center">
                            <INPUT TYPE="button" value="↑"
                                   onclick="moveUp(document.getElementById('select_right'))"><br>
                            <div style="height: 10px;"></div>
                            <INPUT TYPE="button" value="↓" onclick="moveDown(document.getElementById('select_right'));"><br>

                        </td>
                    </tr>
                </table>
                <div align="top"><input type="hidden" id="city" name="city" size="23"/></div>
            </td>
            <td width="60%" valign="top">
                <div class="subtitle" style="border: 0px;margin-bottom: 10px;margin-left:70%">
                    <a href="#" class="easyui-linkbutton l-btn" onclick="resGeneration()">生成自定义条件</a>
                </div>
                <fieldset style="border:1px #cccccc solid">
                    <legend>自定义条件</legend>
                    <div class="sub-div" style="width:800px;height:400px;overflow:scroll;">
                        <table style="width: 100%;overflow:scroll;">
                            <thead style="border: 1px solid #000000;">
                            <th>查询项目名称</th>
                            <th>查询条件</th>
                            <th>查询内容</th>
                            <th>是否查询条件</th>
                            <th>组合条件</th>
                            <th>时间差查询</th>
                            </thead>
                            <tbody id="Ttbody">

                            </tbody>
                        </table>
                    </div>
                </fieldset>
            </td>
        </tr>
        </tbody>
    </table>
</form>
</body>
<script src="webpage/com/zybk/cbscgreporthead/cbsCgreportHead.js"></script>
</html>
